<style type="text/css">
	.content {
		padding: 25px 20px;
	}

	/* 订单详情 */
	.order-detail .order-block {
		height: 31px;
		line-height: 31px;
		background: #e8edf0;
		border-radius: 13px;
		font-size: 14px;
		text-align: center;
		position: relative;
		margin-bottom: 50px;
	}

	.order-detail .order-block:before,
	.order-detail .order-block:after {
		content: "";
		position: absolute;
		z-index: 2;
		left: 0;
		top: 0;
		bottom: 0;
		border-radius: 13px;
		background: #18bc9c;
	}

	.order-detail .order-block:after {
		background: #4dc7af;
		z-index: 1;
	}

	.order-detail .order-block.progress-1:before {
		width: 0;
	}

	.order-detail .order-block.progress-1:after {
		width: 20%;
	}

	.order-detail .order-block.progress-2:before {
		width: 20%;
	}

	.order-detail .order-block.progress-2:after {
		width: 40%;
	}

	.order-detail .order-block.progress-3:before {
		width: 40%;
	}

	.order-detail .order-block.progress-3:after {
		width: 60%;
	}

	.order-detail .order-block.progress-4:before {
		width: 60%;
	}

	.order-detail .order-block.progress-4:after {
		width: 80%;
	}

	.order-detail .order-block.progress-5:before {
		width: 100%;
	}

	.order-detail .order-block.progress-5:after {
		width: 100%;
	}

	.order-detail .order-block.progress-5 li:nth-child(5) {
		color: #fff;
	}

	.order-detail .order-block li {
		width: 20%;
		float: left;
		list-style-type: none;
		border-radius: 13px;
		position: relative;
		z-index: 3;
	}

	.order-detail .order-block .tip {
		font-size: 12px;
		padding-top: 10px;
		color: #717171;
	}

	.order-detail .order-block.progress-1 li:nth-child(1),
	.order-detail .order-block.progress-2 li:nth-child(1),
	.order-detail .order-block.progress-3 li:nth-child(1),
	.order-detail .order-block.progress-4 li:nth-child(1),
	.order-detail .order-block.progress-5 li:nth-child(1) {
		color: #fff;
	}

	.order-detail .order-block.progress-2 li:nth-child(2),
	.order-detail .order-block.progress-3 li:nth-child(2),
	.order-detail .order-block.progress-4 li:nth-child(2),
	.order-detail .order-block.progress-5 li:nth-child(2) {
		color: #fff;
	}

	.order-detail .order-block.progress-3 li:nth-child(3),
	.order-detail .order-block.progress-4 li:nth-child(3),
	.order-detail .order-block.progress-5 li:nth-child(3) {
		color: #fff;
	}

	.order-detail .order-block.progress-4 li:nth-child(4),
	.order-detail .order-block.progress-5 li:nth-child(4) {
		color: #fff;
	}

	.order-detail .td__order-price {
		width: 200px;
		display: inline-block;
	}

	.order-head {
		width: 100%;
		padding: 12px 20px;
		margin-top: 60px;
		/* margin-bottom: 20px; */
		/* border-bottom: 1px solid #eef1f5; */
	}

	.order-head:not(:first-child) {
		margin-top: 0;
	}

	.order-head .title {
		position: relative;
		font-size: 1.5rem;
		color: #333;
	}

	.order-head .title::before {
		content: '';
		position: absolute;
		width: 4px;
		height: 14px;
		background: #18bc9c;
		top: 4px;
		left: -12px;
	}

	.table-responsive .table>tbody>tr>td {
		text-align: center;
		vertical-align: middle;
		color: #676767;
	}

	.ordertext {
		margin: 0 30px;
	}

	.table-bordered {
		border: 1px solid #e8edf0;
	}

	.table-bordered>thead>tr>th,
	.table-bordered>tbody>tr>th,
	.table-bordered>tfoot>tr>th,
	.table-bordered>thead>tr>td,
	.table-bordered>tbody>tr>td,
	.table-bordered>tfoot>tr>td {
		border: 1px solid #e8edf0;
	}

	.table thead tr {
		background: #f8f9fb;
	}

	.order_price span {
		width: 70px;
		display: inline-block;
		text-align: right;
	}
</style>
<div class="row">
	<div class="col-md-12">
		<div class="panel panel-default">
			<div class="panel-heading">商品信息</div>
			<div class="panel-body">
				<p><span>订单号：</span><small>{$row.order_num}</small> <span style="margin-left: 30px;">买家：</span><small>{$row.user.nickname}</small><strong></strong></p>
				<table class="table table-bordered">
					<thead>
						<tr>
							<th class="text-center">
								<div class="th-inner">商品名称</div>
							</th>
							<th class="text-center">
								<div class="th-inner">数量</div>
							</th>
							<th class="text-center">
								<div class="th-inner">单价</div>
							</th>
							<th class="text-center">
								<div class="th-inner">总价</div>
							</th>
							<th class="text-center">
								<div class="th-inner">实际支付</div>
							</th>
							{if $group == "8"}
							<th class="text-center">
								操作
							</th>
							{/if}
						</tr>
					</thead>
					<tbody>
						{volist name="row.ordergoods" id="vo"}
						<tr>
							<td><strong>{$vo.product_name}</strong></td>
							<td>{$vo.number}</td>
							<td>{$vo.single_price}</td>
							<td>{$vo.total_price}</td>
							<td>{$vo.total_price}</td>
							{if $group == "8"}
							<td style="text-align: center">
								{if $row.pay_state == 0}
								<a href="javascript:;" class="btn btn-error-light">未支付 </a>
								{else /}
								{if $vo.status == 0 && $row.pay_state > 0}
								<a href="javascript:;" class="btn btn-primary btn-success allocation" data-id="{$vo.id}">调拨 </a>
								{else /}
								<a href="javascript:;" class="btn btn-normal">已调拨 </a>
								{/if}
								{/if}
							</td>
							{/if}
						</tr>
						{/volist}
					</tbody>
					<tfoot>
					<tr>
						<th colspan="10" style="text-align: right;">
							<span class="ordertext">商品总价：<samp class="text-red">￥{$row.price}</samp></span>
							<span class="ordertext">运费：<samp class="text-red">￥0.00</samp> </span>
							<span class="ordertext">实际支付：<samp class="text-red">￥{$row.pay_price}</samp></span>
						</th>
					</tr>
					</tfoot>
				</table>
				<div style="color: #333;">
					<p style="margin-bottom: 15px;">支付方式：
						{switch name="row.pay_type"}
							{case value="1"}<span class="label label-warning">余额支付</span>{/case}
						    {case value="2"}<span class="label label-primary">微信支付</span>{/case}
						    {case value="3"}<span class="label label-primary">认购量支付</span>{/case}
						{/switch}
					</p>
					<p style="margin-bottom: 15px;">交易状态：
						{switch name="row.pay_state"}
							{case value="0"}<span class="label label-info">未支付</span>{/case}
							{case value="1"}<span class="label label-warning">已支付</span>{/case}
						    {case value="2"}<span class="label label-primary">已完成</span>{/case}
							{case value="3"}<span class="label label-success">支付失败</span>{/case}
						{/switch}
					</p>
					<p>配送方式：<small>上级发货</small></p>
					{notempty name="row.remark"}
						<p>买家留言：{$row.remark}</small></p>
					{/notempty}
				</div>
			</div>
		</div>
	</div>
	
	{if condition="in_array($row.pay_state,[1,2])"}
	<div class="col-md-12">
		<div class="panel panel-default">
			<div class="panel-heading">付款信息</div>
			<div class="panel-body">
				<table class="table table-striped">
					<tbody>
						<tr>
							<td>交易号</td>
							<td>{$row.order_num}</td>
						</tr>
						<tr>
							<td>支付方式</td>
							<td>{$row.pay_type_text}</td>
						</tr>
						{if $row.pay_type == 2}
						<tr>
							<td>微信订单号</td>
							<td>{$row.trade_no}</td>
						</tr>
						{/if}
						<tr>
							<td>付款状态</td>
							<td>{$row.pay_state_text}</td>
						</tr>
						<tr>
							<td>付款时间</td>
							<td>{$row.pay_time_text}</td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>
	</div>
	{/if}
</div>





<div class="hide layer-footer">
	<label class="control-label col-xs-12 col-sm-2"></label>
	<div class="col-xs-12 col-sm-8">
		<button type="reset" class="btn btn-primary btn-embossed btn-close" onclick="Layer.closeAll();">{:__('Close')}</button>
	</div>
</div>
